import 'package:flutter/material.dart';
import 'package:flutter_learn_vi/src/page/news/news_detaile_page.dart';
import 'package:flutter_learn_vi/src/utils/navigator_utils.dart';
import 'package:flutter_learn_vi/src/utils/toast_utils.dart';

import '../../../../bean/bean_integral.dart';
import 'mine_my_his_recoder_page.dart';

/// 创建人： Created by zhaolong
/// 创建时间：Created by  on 2020/12/4.
///
/// 可关注公众号：我的大前端生涯   获取最新技术分享
/// 可关注网易云课堂：https://study.163.com/instructor/1021406098.htm
/// 可关注博客：https://blog.csdn.net/zl18603543572
///
/// 代码清单
class MineMyScoreHisIntegralPage extends StatefulWidget {
  final List<IntegralStatBean> list;
  final IntegralStatBean configDetails;

  const MineMyScoreHisIntegralPage({
    Key key,
    this.list,
    this.configDetails,
  }) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _MineItem2State();
  }
}

class _MineItem2State extends State<MineMyScoreHisIntegralPage>
    with AutomaticKeepAliveClientMixin, TickerProviderStateMixin {
  //标签页面保活 或者称保持状态
  @override
  bool get wantKeepAlive => true;

  AnimationController _animationController;

  Animation<Offset> _animation;
  List<IntegralStatBean> _list;

  @override
  void initState() {
    super.initState();
    _list = widget.list;
    _animationController = new AnimationController(
        vsync: this, duration: Duration(milliseconds: 1200));

    _animation = new Tween(begin: Offset(0, -1), end: Offset(0, 0)).animate(
        CurvedAnimation(
            curve: Curves.fastOutSlowIn, parent: _animationController));
  }

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);

    //一个列表 切记不要再使用 Scaffold
    //否则会拦截事件 失去滑动联动效果
    return Container(
      padding: EdgeInsets.only(top: 12),
      color: Colors.white,
      child: ListView.builder(
        //去除内边距
        padding: EdgeInsets.all(0),
        //列表子Item个数
        itemCount: _list.length,
        //每个子Item的布局构建
        itemBuilder: (BuildContext context, int index) {
          return buildBodyWidget(index);
        },
      ),
    );
  }

  //每个子Item的布局构建
  Widget buildBodyWidget(int index) {
    IntegralStatBean beanDayStat = _list[index];

    //水波纹点击事件监听
    return InkWell(
      //手指点击抬起时的回调
      onTap: () {
        if (beanDayStat.configForm == 1) {
          if (beanDayStat.extractingId == 0) {
            ToastUtils.showToast("暂不可查看详情");
            return;
          }
          NavigatorUtils.pushPage(
            context,
            MineMyScoreHisRecoderPage(
              extractingId: beanDayStat.extractingId,
            ),
          );
          return;
        }

        if (beanDayStat.configForm == 2) {
          if (beanDayStat.newsId == 0) {
            ToastUtils.showToast("暂不可查看详情");
            return;
          }
          NavigatorUtils.pushPage(
            context,
            NewsDetailePage(
              newsId: beanDayStat.newsId,
              screenSize: MediaQuery.of(context).size,
            ),
          );
          return;
        }
      },
      child: Container(
        padding: EdgeInsets.only(left: 10, right: 10),
        color: Colors.white,
        //线性布局左右排列
        child: Row(
          //主轴方向开始对齐 在这里是左对齐
          mainAxisAlignment: MainAxisAlignment.start,
          //交叉轴上开始对齐 在这里是顶部对齐
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            //左侧的图片
            buildLeftImage(index, beanDayStat),
            //右侧的文本区域
            Expanded(child: buildRightTextArea(index, beanDayStat))
          ],
        ),
      ),
    );
  }

  ///左侧的图片区域
  Container buildLeftImage(int index, IntegralStatBean beanDayStat) {
    int obtainScore = (beanDayStat.obtainScore / 10).toInt();
    Color color;
    IconData iconData;
    if (obtainScore > 90) {
      iconData = Icons.text_rotate_up_sharp;
      color = Colors.green;
    } else if (obtainScore <= 90 && obtainScore >= 60) {
      iconData = Icons.text_rotate_up_sharp;
      color = Colors.blue;
    } else {
      iconData = Icons.tag_faces_rounded;
      color = Colors.redAccent;
    }

    return Container(
      margin: EdgeInsets.only(right: 12),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Container(
            width: 1,
            height: 6,
            color: index == 0 ? Colors.transparent : color,
          ),
          ClipOval(
            child: Container(
              width: 8,
              height: 8,
              color: color,
            ),
          ),
          Container(
            width: 1,
            height: buildRemark(beanDayStat).length < 40 ? 60 : 100,
            color: index == _list.length - 1 ? Colors.transparent : color,
          ),
        ],
      ),
    );
  }

  ///右侧的文本区域
  Expanded buildRightTextArea(int index, IntegralStatBean beanDayStat) {
    // double obtainScore = beanDayStat.obtainScore / 10;
    // String timeStr = "${beanDayStat.answerTime}秒";
    // if (beanDayStat.answerTime > 60) {
    //   timeStr =
    //       "${beanDayStat.answerTime ~/ 60}分${(beanDayStat.answerTime % 60).toInt()}秒";
    // }
    // String rightTips = "";
    // Color rightTipsColor = Colors.black38;
    // if (beanDayStat.extractingId > 0) {
    //   rightTips = "【点击查看详情】";
    //   rightTipsColor = Colors.blue;
    // }
    // String text =
    //     "${beanDayStat.createTime} 答题 $timeStr 获取 ${obtainScore.toStringAsFixed(0)}分 ";
    // if (widget.configDetails.configForm == 2) {
    //   text = "${beanDayStat.createTime}   阅读 $timeStr  ";
    // }
    return Expanded(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min,
        children: [
          Text(
            buildRemark(beanDayStat),
            maxLines: 2,
            softWrap: true,
            overflow: TextOverflow.ellipsis,
            textAlign: TextAlign.left,
            style: TextStyle(
                fontSize: 14, color: Colors.black, fontWeight: FontWeight.w500),
          ),
          SizedBox(height: 10),
          Row(
            children: [
              Expanded(
                child: Text(
                  "${beanDayStat.createTime}",
                  softWrap: true,
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                  textAlign: TextAlign.left,
                  style: TextStyle(fontSize: 12, color: Colors.grey),
                ),
              ),
              Text(
                beanDayStat.stelleOn == 0 ? "未到账" : "已到账",
                style: TextStyle(
                    fontSize: 14,
                    color:
                        beanDayStat.stelleOn == 1 ? Colors.green : Colors.grey),
              )
            ],
          ),
          SizedBox(height: 20),
        ],
      ),
    );
  }

  String buildRemark(IntegralStatBean item) {
    if (item.remark.isNotEmpty) {
      return item.remark;
    }
    return item.systemRemark;
  }
}
